import React from 'react';
import { connect } from 'react-redux';
import { Switch, Route } from 'react-router-dom';
import { object } from 'prop-types'
import SideBar from '../component/SideBar'
import Header from '../component/Header'
import TabBar from '../component/TabBar';
import AsyncLoad from '../component/common/AsyncLoad';

const AsyncHome = AsyncLoad({ loader: () => import('../pages/Home') })
const AsyncDocs = AsyncLoad({ loader: () => import('../pages/Docs') })

function CustomHome() {
    return (
        <div className="dfccb h100">
            <Header />
            <div style={{ display: 'flex', flex: 1, position: 'relative',width:'100%' }}>
                <Switch>
                    <Route exact path='/' component={AsyncHome} />
                    <Route path='/Docs' component={AsyncDocs} />
                </Switch>
            </div>
            <TabBar />
        </div>
    )
}
export default connect()(CustomHome)